<html>
<head>
  <title>FBuy</title>
  <!--screen settings for mobile device--->
  <meta name="viewport" content="initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
</head>

<body onload="setTimeout(function() { window.scrollTo(0, 1) }, 100);">
<h1> FBuy - Facebook Application that sells mobile apps </h1>

<!------ Facebook Javascript SDK --------->
<div id="fb-root"></div>
<script>
  (function() {
    var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
        }());
</script>

<!-------End of Facebook Javascript SDK----->

<!----Initialize Facebook javascript sdk----->
<script>
  window.fbAsyncInit = function() {
    FB.init({ appId: '349555388427787', 
      status: true, 
      cookie: true,
      xfbml: true,
      oauth: true});

      FB.Event.subscribe('auth.authResponseChange', handleResponseChange);

     };
</script>
<!------End of sdk initialization---->

<!----This function is triggered when the user authenticates----->
<script>
  function handleResponseChange(response) {
      document.body.className = response.authResponse ? 'connected' : 'not_connected';
      if (response.authResponse) {
        console.log(response);

        updateUserInfo(response);
      }
    }
 </script>
 <!-----End of authenticate trigger function--------->
 
 <!-----Log in user if user hasn't logged into facebook---->
 <div id="login">
   <p><button onClick="loginUser();">Login</button></p>
 </div>
 
 <!------ End of facebook login reminder---->

 <script>
   function loginUser() {    
     FB.login(function(response) { }, {scope:'email'});     
     }
 </script>
 
 <style>
  body.connected #login { display: none; }
  body.connected #logout { display: block; }
  body.not_connected #login { display: block; }
  body.not_connected #logout { display: none; }
  </style>
 
 <div id="user-info"></div>
 <script>
   function updateUserInfo(response) {
     FB.api('/me', function(response) {
       document.getElementById('user-info').innerHTML = '<img src="https://graph.facebook.com/' + response.id + '/picture">' + response.name;
     });
   }
 </script>
 
 <div id="logout">
   <p><button  onClick="FB.logout();">Logout</button></p>
 </div>
 
<table height='100' width='400'>

  <tr>
    <td>
	  <fb:like>
      <a href="phpapp/index.php"><img src="../images/notes_image.jpg"  height="100" width="100" alt="Green Notes Mobile App" align="left" /> </a>
	  <br />
	  <p> <h2> Green Notes </h2> </p>
      <p> A note taking application for android and ios
          This App lets you take notes of anything and everything.
          It helps you take notes, save and tag them with location.
          The notes are saved in a well organised structure. The 
          users can also choose to email the notes or share it on 
          social networking sites. 		  </p>
      <p> <h3> Price: 50 facebook credits </h3> </p> </fb:like>	  
    </td>

  </tr>
  
  <tr>
    <td>
	  <fb:like>
      <a href="phpapp/SFtours.php"><img src="../images/sftours_image.png"  height="100" width="100" alt="SF Tours" align="left"/> </a>
	  <p> <h2> SF Tours </h2> </p>
      <p> San Francisco Guide </p>
      <p> <h3> Price: 75 facebook credits </h3> </p> </fb:like>

<tr>
    <td>
	  <fb:like>
      <a href="phpapp/Mydeals.php"><img src="../images/mydeals_image.jpg"  height="100" width="100" alt="My Deals" align="left"/> </a>
	  <p> <h2> My Deals </h2> </p>
      <p> Save your deals </p>
      <p> <h3> Price: 75 facebook credits </h3> </p> </fb:like>	  
    </td>	  
    </td>
</table>

</body>

</html>


 
 <!-- Get friends
 <a href="#" onclick="getUserFriends();">Get friends</a><br>
 <div id="user-friends"></div>
 <script>
 function getUserFriends() {
   FB.api('/me/friends&fields=name,picture', function(response) {
     console.log('Got friends: ', response);

     if (!response.error) {
       var markup = '';

       var friends = response.data;

       for (var i=0; i < friends.length && i < 25; i++) {
         var friend = friends[i];

         markup += '<img src="' + friend.picture + '"> ' + friend.name + '<br>';
       }

       document.getElementById('user-friends').innerHTML = markup;
     }
   });
 }
 </script>
 
  end of get friends -->